<template>
  <div class="show_notice_box">
    <div class="zhezhao" v-if="!$store.state.ggX.id">
      加载中
      <i> ......</i>
    </div>
    <box-header/>
    <box-content/>
    <box-footer/>
  </div>
</template>

<script>
import { getNto } from 'com/shuju'
import BoxContent from '@/pages/showNot/components/content'
import BoxHeader from '@/pages/showNot/components/header'
import BoxFooter from '@/pages/showNot/components/footer'
export default {
  name: 'ShowNotice',
  components: {
    BoxHeader,
    BoxContent,
    BoxFooter
  },
  mounted () {
    getNto(this.$route.query.noticId, this)
    console.clear()
  }
}
</script>

<style lang="stylus" scoped>
  .show_notice_box{
    position: relative
    width: 1200px
    height: auto
    min-height: 680px
    border: 1px solid rgb(15,153,213)
    border-top: 10px solid rgb(15,180,213)
    margin: 0 auto
    margin-top: 30px
    background: white
    .zhezhao{
      position: absolute
      width: 100%
      height: 100%
      font-size: .7rem
      line-height: 500px
      text-align: center
      background: rgb(180,180,180)
      z-index: 2
      i{
        animation: 1.5s linear infinite loading
        transition: all .5s
      }
      @keyframes loading{
        0%{
          opacity: 1
        }
        25%{
          opacity: .5
        }
        50%{
          opacity: 0
        }
        75%{
          opacity: .5
        }
        100%{
          opacity: 1
        }
      }
    }
  }
</style>
